<template>
    <div class='contentUi'>
        <span class="label">{{label}}</span>
        <div class="components">
            <el-select v-model="subject" placeholder="请选择" clearable >
                <el-option
                    v-for="item in subjectoptions"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                ></el-option>
            </el-select>
        </div>
    </div>
</template>

<script>
    import {mapState,mapMutations} from 'vuex';
    import {subjectoptions} from '@/static/js/select_data.js';
   export default {
    data() {
        return {
            label: '科目',
            subject:''
        }
    },
    computed: {
        subjectoptions(){
            return subjectoptions;
        },
        ...mapState({
            getInput_subject:state=>state.pubilcModule.input_subject
        })
    },
    watch: {
        subject(){
            this.setInput_subject(this.subject);
        },
        getInput_subject(){
            //监听重置
            if(this.getInput_subject === ''){
                this.subject = '';
            }
        },
    },
    methods: {
        ...mapMutations({
            setInput_subject:'pubilcModule/setInput_subject'
        })
    },
   }
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>


</style>
